<!DOCTYPE html>
<html lang="zh-CN" xmlns:th=http://www.thymeleaf.org>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>SiQ | 启航</title>
    <link th:href="@{inspinia/css/bootstrap.min.css}" rel="stylesheet">
    <link th:href="@{inspinia/font-awesome-4.7.0/css/font-awesome.min.css}" rel="stylesheet"/>
    <!-- 提示框样式 -->
    <link th:href="@{inspinia/css/plugins/toastr/toastr.min.css}" rel="stylesheet">
    <!-- 悬浮提示框样式 -->
    <link th:href="@{inspinia/js/plugins/gritter/jquery.gritter.css}" rel="stylesheet">
    <!-- 主题样式 -->
    <link th:href="@{inspinia/css/animate.css}" rel="stylesheet">
    <!-- 额外样式 -->
    <link th:href="@{inspinia/css/style.css}" rel="stylesheet">
    <link th:href="@{inspinia/css/jquery.mloading.css}" rel="stylesheet">
    <link th:href="@{inspinia/css/jquery-confirm.css}" rel="stylesheet">
    <link th:href="@{inspinia/css/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css}" rel="stylesheet">
    <link th:href="@{inspinia/css/plugins/iCheck/custom.css}" rel="stylesheet">

</head>
<body class="fixed-sidebar">
<div id="wrapper">
    <!-- 左边菜单栏-->
    <nav class="navbar-default navbar-static-side" role="navigation">
        <div class="sidebar-collapse">
            <ul class="nav metismenu" id="side-menu">
                <!-- 这个样式决定图像位置 -->
                <li class="nav-header">
                    <div class="dropdown profile-element" style="text-align: center">
                        <!--TODO 登录用户头像-->
                        <!--<img alt="image" style="width:80px;" class="img-circle" th:src="@{inspinia/img/default-avatar.png}"/>-->
                        <i class="fa fa-slideshare fa-5x"></i>
                        <!--<i class="fa fa-desktop fa-5x"></i>-->
                        <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                            <span class="clear">
                                <span class="block m-t-xs">
                                <strong class="font-bold" th:text="${session.userSession.username}"></strong>
                                </span>
                            </span>
                        </a>
                    </div>
                    <div class="logo-element">
                        SiQ
                    </div>
                </li>
                <!-- TODO 权限菜单 -->
                <li class="active">
                    <a href="#"><i class="fa fa-sitemap"></i> <span class="nav-label">数据库列表</span><span
                            class="fa arrow"></span></a>
                    <ul class="nav nav-second-level collapse" th:each="database : ${databases}">
                        <li>
                            <a href="javascript:void(0);" th:onclick="'javascript:getPage(\''+${database.name}+'\')'">
                                <i class="fa fa-database"></i>:
                                <span class="nav-label" th:text="${database.name}"></span>
                            </a>
                        </li>
                    </ul>
                </li>
                <li >
                    <a href="index.html"><i class="fa fa-th-large"></i>
                        <span class="nav-label">系统管理</span><span class="fa arrow"></span>
                    </a>
                    <ul class="nav nav-second-level">
                        <li class="active">
                            <a href="dashboard_2.html">用户中心
                                <span class="label label-warning pull-right">2017/10/02</span>
                            </a>
                        </li>
                    </ul>
                </li>
            </ul>

        </div>
    </nav>
    <!-- 左边菜单栏 END-->
    <!-- 主页面 -->
    <div id="page-wrapper" class="gray-bg dashbard-1">
        <div class="row border-bottom">
            <nav class="navbar navbar-static-top" role="navigation" style="margin-bottom: 0">
                <div class="navbar-header">
                    <a class="navbar-minimalize minimalize-styl-2 btn btn-primary " href="#"><i class="fa fa-bars"></i>
                    </a>
                </div>
                <ul class="nav navbar-top-links navbar-right">
                    <li>
                        <span class="m-r-sm text-muted welcome-message">欢迎使用SiQ</span>
                    </li>

                    <li>
                        <a href="logout">
                            <i class="fa fa-sign-out"></i> 退出系统
                        </a>
                    </li>
                    <li>
                        <a class="right-sidebar-toggle">
                            <i class="fa fa-tasks"></i>设置
                        </a>
                    </li>
                </ul>

            </nav>
        </div>

        <!-- TODO 主要界面切换 -->
        <div id="main-div">
            <div id="content-div"></div>
        </div>
        <div class="footer">
            <div class="pull-right">
                <strong th:text="|版本：${VERSION}|">
                </strong>
                <strong>
                    |
                    <i class="fa fa-css3"></i>
                    <i class="fa fa-html5"></i>
                </strong>
            </div>
            <div>
                <strong>&copy;
                    <i class="fa fa-github" aria-hidden="true"></i>
                    <a href="https://github.com/kkillala/mssql-web">
                        SiQ
                    </a>
                </strong>
            </div>
        </div>
    </div>
    <!-- 配置界面 -->
    <div id="right-sidebar" class="animated">
        <div class="sidebar-container">

            <ul class="nav nav-tabs navs-3">

                <li class="active"><a data-toggle="tab" href="#tab-1">
                    备忘录
                </a></li>
                <li><a data-toggle="tab" href="#tab-2">
                    面板2
                </a></li>
                <li class=""><a data-toggle="tab" href="#tab-3">
                    <i class="fa fa-gear"> 设置</i>
                </a></li>
            </ul>

            <div class="tab-content">

                <div id="tab-1" class="tab-pane active">

                    <div class="sidebar-title">
                        <h3><i class="fa fa-comments-o"></i> Latest Notes</h3>
                        <small><i class="fa fa-tim"></i> You have 10 new message.</small>
                    </div>

                    <div>

                        <div class="sidebar-message">
                            <a href="#">
                                <div class="pull-left text-center">
                                    <img alt="image" class="img-circle message-avatar" src="inspinia/img/a1.jpg">

                                    <div class="m-t-xs">
                                        <i class="fa fa-star text-warning"></i>
                                        <i class="fa fa-star text-warning"></i>
                                    </div>
                                </div>
                                <div class="media-body">

                                    There are many variations of passages of Lorem Ipsum available.
                                    <br>
                                    <small class="text-muted">Today 4:21 pm</small>
                                </div>
                            </a>
                        </div>
                        <div class="sidebar-message">
                            <a href="#">
                                <div class="pull-left text-center">
                                    <img alt="image" class="img-circle message-avatar" src="inspinia/img/a2.jpg">
                                </div>
                                <div class="media-body">
                                    The point of using Lorem Ipsum is that it has a more-or-less normal.
                                    <br>
                                    <small class="text-muted">Yesterday 2:45 pm</small>
                                </div>
                            </a>
                        </div>
                        <div class="sidebar-message">
                            <a href="#">
                                <div class="pull-left text-center">
                                    <img alt="image" class="img-circle message-avatar" src="inspinia/img/a3.jpg">

                                    <div class="m-t-xs">
                                        <i class="fa fa-star text-warning"></i>
                                        <i class="fa fa-star text-warning"></i>
                                        <i class="fa fa-star text-warning"></i>
                                    </div>
                                </div>
                                <div class="media-body">
                                    Mevolved over the years, sometimes by accident, sometimes on purpose (injected
                                    humour and the like).
                                    <br>
                                    <small class="text-muted">Yesterday 1:10 pm</small>
                                </div>
                            </a>
                        </div>
                        <div class="sidebar-message">
                            <a href="#">
                                <div class="pull-left text-center">
                                    <img alt="image" class="img-circle message-avatar" src="inspinia/img/a4.jpg">
                                </div>

                                <div class="media-body">
                                    Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the
                                    <br>
                                    <small class="text-muted">Monday 8:37 pm</small>
                                </div>
                            </a>
                        </div>
                        <div class="sidebar-message">
                            <a href="#">
                                <div class="pull-left text-center">
                                    <img alt="image" class="img-circle message-avatar" src="inspinia/img/a8.jpg">
                                </div>
                                <div class="media-body">

                                    All the Lorem Ipsum generators on the Internet tend to repeat.
                                    <br>
                                    <small class="text-muted">Today 4:21 pm</small>
                                </div>
                            </a>
                        </div>
                        <div class="sidebar-message">
                            <a href="#">
                                <div class="pull-left text-center">
                                    <img alt="image" class="img-circle message-avatar" src="inspinia/img/a7.jpg">
                                </div>
                                <div class="media-body">
                                    Renaissance. The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet..", comes
                                    from a line in section 1.10.32.
                                    <br>
                                    <small class="text-muted">Yesterday 2:45 pm</small>
                                </div>
                            </a>
                        </div>
                        <div class="sidebar-message">
                            <a href="#">
                                <div class="pull-left text-center">
                                    <img alt="image" class="img-circle message-avatar" src="inspinia/img/a3.jpg">

                                    <div class="m-t-xs">
                                        <i class="fa fa-star text-warning"></i>
                                        <i class="fa fa-star text-warning"></i>
                                        <i class="fa fa-star text-warning"></i>
                                    </div>
                                </div>
                                <div class="media-body">
                                    The standard chunk of Lorem Ipsum used since the 1500s is reproduced below.
                                    <br>
                                    <small class="text-muted">Yesterday 1:10 pm</small>
                                </div>
                            </a>
                        </div>
                        <div class="sidebar-message">
                            <a href="#">
                                <div class="pull-left text-center">
                                    <img alt="image" class="img-circle message-avatar" src="inspinia/img/a4.jpg">
                                </div>
                                <div class="media-body">
                                    Uncover many web sites still in their infancy. Various versions have.
                                    <br>
                                    <small class="text-muted">Monday 8:37 pm</small>
                                </div>
                            </a>
                        </div>
                    </div>

                </div>

                <div id="tab-2" class="tab-pane">

                    <div class="sidebar-title">
                        <h3><i class="fa fa-cube"></i> Latest projects</h3>
                        <small><i class="fa fa-tim"></i> You have 14 projects. 10 not completed.</small>
                    </div>

                    <ul class="sidebar-list">
                        <li>
                            <a href="#">
                                <div class="small pull-right m-t-xs">9 hours ago</div>
                                <h4>Business valuation</h4>
                                It is a long established fact that a reader will be distracted.

                                <div class="small">Completion with: 22%</div>
                                <div class="progress progress-mini">
                                    <div style="width: 22%;" class="progress-bar progress-bar-warning"></div>
                                </div>
                                <div class="small text-muted m-t-xs">Project end: 4:00 pm - 12.06.2014</div>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <div class="small pull-right m-t-xs">9 hours ago</div>
                                <h4>Contract with Company </h4>
                                Many desktop publishing packages and web page editors.

                                <div class="small">Completion with: 48%</div>
                                <div class="progress progress-mini">
                                    <div style="width: 48%;" class="progress-bar"></div>
                                </div>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <div class="small pull-right m-t-xs">9 hours ago</div>
                                <h4>Meeting</h4>
                                By the readable content of a page when looking at its layout.

                                <div class="small">Completion with: 14%</div>
                                <div class="progress progress-mini">
                                    <div style="width: 14%;" class="progress-bar progress-bar-info"></div>
                                </div>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <span class="label label-primary pull-right">NEW</span>
                                <h4>The generated</h4>
                                There are many variations of passages of Lorem Ipsum available.
                                <div class="small">Completion with: 22%</div>
                                <div class="small text-muted m-t-xs">Project end: 4:00 pm - 12.06.2014</div>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <div class="small pull-right m-t-xs">9 hours ago</div>
                                <h4>Business valuation</h4>
                                It is a long established fact that a reader will be distracted.

                                <div class="small">Completion with: 22%</div>
                                <div class="progress progress-mini">
                                    <div style="width: 22%;" class="progress-bar progress-bar-warning"></div>
                                </div>
                                <div class="small text-muted m-t-xs">Project end: 4:00 pm - 12.06.2014</div>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <div class="small pull-right m-t-xs">9 hours ago</div>
                                <h4>Contract with Company </h4>
                                Many desktop publishing packages and web page editors.

                                <div class="small">Completion with: 48%</div>
                                <div class="progress progress-mini">
                                    <div style="width: 48%;" class="progress-bar"></div>
                                </div>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <div class="small pull-right m-t-xs">9 hours ago</div>
                                <h4>Meeting</h4>
                                By the readable content of a page when looking at its layout.

                                <div class="small">Completion with: 14%</div>
                                <div class="progress progress-mini">
                                    <div style="width: 14%;" class="progress-bar progress-bar-info"></div>
                                </div>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <span class="label label-primary pull-right">NEW</span>
                                <h4>The generated</h4>
                                <!--<div class="small pull-right m-t-xs">9 hours ago</div>-->
                                There are many variations of passages of Lorem Ipsum available.
                                <div class="small">Completion with: 22%</div>
                                <div class="small text-muted m-t-xs">Project end: 4:00 pm - 12.06.2014</div>
                            </a>
                        </li>

                    </ul>

                </div>

                <div id="tab-3" class="tab-pane">

                    <div class="sidebar-title">
                        <h3><i class="fa fa-gears"></i> Settings</h3>
                        <small><i class="fa fa-tim"></i> You have 14 projects. 10 not completed.</small>
                    </div>

                    <div class="setings-item">
                    <span>
                        Show notifications
                    </span>
                        <div class="switch">
                            <div class="onoffswitch">
                                <input type="checkbox" name="collapsemenu" class="onoffswitch-checkbox" id="example">
                                <label class="onoffswitch-label" for="example">
                                    <span class="onoffswitch-inner"></span>
                                    <span class="onoffswitch-switch"></span>
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="setings-item">
                    <span>
                        Disable Chat
                    </span>
                        <div class="switch">
                            <div class="onoffswitch">
                                <input type="checkbox" name="collapsemenu" checked class="onoffswitch-checkbox"
                                       id="example2">
                                <label class="onoffswitch-label" for="example2">
                                    <span class="onoffswitch-inner"></span>
                                    <span class="onoffswitch-switch"></span>
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="setings-item">
                    <span>
                        Enable history
                    </span>
                        <div class="switch">
                            <div class="onoffswitch">
                                <input type="checkbox" name="collapsemenu" class="onoffswitch-checkbox" id="example3">
                                <label class="onoffswitch-label" for="example3">
                                    <span class="onoffswitch-inner"></span>
                                    <span class="onoffswitch-switch"></span>
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="setings-item">
                    <span>
                        Show charts
                    </span>
                        <div class="switch">
                            <div class="onoffswitch">
                                <input type="checkbox" name="collapsemenu" class="onoffswitch-checkbox" id="example4">
                                <label class="onoffswitch-label" for="example4">
                                    <span class="onoffswitch-inner"></span>
                                    <span class="onoffswitch-switch"></span>
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="setings-item">
                    <span>
                        Offline users
                    </span>
                        <div class="switch">
                            <div class="onoffswitch">
                                <input type="checkbox" checked name="collapsemenu" class="onoffswitch-checkbox"
                                       id="example5">
                                <label class="onoffswitch-label" for="example5">
                                    <span class="onoffswitch-inner"></span>
                                    <span class="onoffswitch-switch"></span>
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="setings-item">
                    <span>
                        Global search
                    </span>
                        <div class="switch">
                            <div class="onoffswitch">
                                <input type="checkbox" checked name="collapsemenu" class="onoffswitch-checkbox"
                                       id="example6">
                                <label class="onoffswitch-label" for="example6">
                                    <span class="onoffswitch-inner"></span>
                                    <span class="onoffswitch-switch"></span>
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="setings-item">
                    <span>
                        Update everyday
                    </span>
                        <div class="switch">
                            <div class="onoffswitch">
                                <input type="checkbox" name="collapsemenu" class="onoffswitch-checkbox" id="example7">
                                <label class="onoffswitch-label" for="example7">
                                    <span class="onoffswitch-inner"></span>
                                    <span class="onoffswitch-switch"></span>
                                </label>
                            </div>
                        </div>
                    </div>

                    <div class="sidebar-content">
                        <h4>Settings</h4>
                        <div class="small">
                            I belive that. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
                            And typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since
                            the 1500s.
                            Over the years, sometimes by accident, sometimes on purpose (injected humour and the like).
                        </div>
                    </div>

                </div>
            </div>

        </div>


    </div>
    <!-- 配置界面结束-->
</div>

<div id="modal-main" class="modal">
    <div class="modal-dialog">
        <div class="modal-content"></div>
    </div>
</div>
<!-- Mainly scripts -->
<script src="inspinia/js/jquery-3.1.1.min.js"></script>
<script src="inspinia/js/bootstrap.min.js"></script>
<script src="inspinia/js/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src="inspinia/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>

<!-- Peity -->
<script src="inspinia/js/plugins/peity/jquery.peity.min.js"></script>
<script src="inspinia/js/demo/peity-demo.js"></script>

<!-- Custom and plugin javascript -->
<script src="inspinia/js/inspinia.js"></script>
<script src="inspinia/js/plugins/pace/pace.min.js"></script>

<!-- jQuery UI -->
<script src="inspinia/js/plugins/jquery-ui/jquery-ui.min.js"></script>

<!-- Toastr -->
<script src="inspinia/js/plugins/toastr/toastr.min.js"></script>

<!--jquery.form.js-->
<script src="inspinia/js/jquery.form.js"></script>
<!--jquery loading-->
<script src="inspinia/js/jquery.mloading.js"></script>
<!--jquery confirm-->
<script src="inspinia/js/jquery-confirm.js"></script>
<script>
    var myMLoading = null;
    /*<![CDATA[*/
    $(document).ready(function () {
        setTimeout(function () {
            showMessage(1,'欢迎登陆SiQ数据库管理中心！',2);
        }, 700);
        $('.sidebar-collapse').slimScroll({
            height: '100%',
            railOpacity: 0.8
        });
        $('.page-wrapper').slimScroll({
            height: '100%',
            railOpacity: 0.8
        });
        getPage("null");
        $("#modal-main").on("hidden", function() {
            $(this).removeData("modal");
            $(this).find(".modal-content").children().remove();
        });
        $("#modal-main").on("hidden.bs.modal", function() {
            $(this).removeData("bs.modal");
            $(this).find(".modal-content").children().remove();
        });
    });
    /**
     * 遮罩层显示
     */
    function showMLoading(){
        myMLoading = $.confirm({
//            icon: 'fa fa-spinner fa-spin',
            icon: 'fa fa-spinner fa-pulse',
            title: '加载中...', // hides the title.
            cancelButton: false, // hides the cancel button.
            confirmButton: false, // hides the confirm button.
            closeIcon: false, // hides the close icon.
            content: false // hides content block.
        });
    }
//    function showMLoading(id) {
//        var intRandom =  Math.floor(Math.random()*2);
//        var mLoadingOpt = {
//            text:"",//加载文字，默认值：加载中...
//            icon:"inspinia/img/loading/loading0"+intRandom+".gif",//加载图标，默认值：一个小型的base64的gif图片
//            html:false,//设置加载内容是否是html格式，默认值是false
//            content:"",//忽略icon和text的值，直接在加载框中显示此值
//            mask:true//是否显示遮罩效果，默认显示
//        };
//        $("#"+id).mLoading(mLoadingOpt);
//        $(".mloading-icon").css('width','200px');
//        $(".mloading-icon").css('height','150px');
//    }
    /**
     * 遮罩层隐藏
     */
    function hideMLoading() {
        myMLoading.close();
    }
//    function hideMLoading(id) {
//        $("#"+id).mLoading("hide");
//    }
    /**
     * 提示框
     * flag = 1 success
     * flag = 2 warning
     * flag = 3 error
     */
    function showMessage(flag,message,timeOut,title) {
        if(title == null || title == undefined) {
            title = '';
        }
        if(timeOut !=null && timeOut != undefined) {
            timeOut = timeOut * 1000;
        }
        toastr.options = {
            closeButton: true,
            progressBar: true,
            showMethod: 'slideDown',
            timeOut: timeOut
        };
        if(flag == 0) {
            toastr.info(title,message);
        }else if(flag == 1) {
            toastr.success(title,message);
        }else if(flag == 2) {
            toastr.warning(title,message);
        }else {
            toastr.error(title,message);
        }
    }
    /**
     * 获取右边面板组件
     */
    function getPage(db) {
        $.get("db/"+db, function (data) {
            $('#content-div').remove();
            $('#main-div').append("<div id=\"content-div\"></div>");
            $('#content-div').append(data);
        });
    }

    //animate.css动画触动一次方法
    $.fn.extend({
        animateCss: function (animationName) {
            var animationEnd = 'webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend';
            this.addClass('animated ' + animationName).one(animationEnd, function() {
                $(this).removeClass('animated ' + animationName);
            });
        }
    });
    /**
     * 显示模态框方法
     * @param targetModel 模态框选择器，jquery选择器
     * @param animateName 弹出动作
     * @param href 远程调用
     */
    var modalShow = function(animateName, href){
        var targetModel = "#modal-main";
        $('#modal-content').remove();
        $('#modal-dialog').append("<div class=\"modal-content\"></div>");
        var animationIn = [
            "rubberBand","shake","bounce","flash","pulse","swing","tada", "wobble",
            "bounceIn","bounceInDown","bounceInLeft","bounceInRight",
            "bounceInUp", "fadeIn", "fadeInDown", "fadeInLeft", "fadeInRight",
            "fadeInDownBig", "fadeInLeftBig","flipInX","flipInY",
            "lightSpeedIn","rotateIn","rotateInDownLeft","rotateInDownRight","rotateInUpLeft","rotateInUpRight",
            "slideInDown","slideInLeft",
            "slideInRight", "slideInUp","rollIn","flip"];
        if(!animateName || animationIn.indexOf(animateName)==-1){
            var intRandom =  Math.floor(Math.random()*animationIn.length);
            animateName = animationIn[intRandom];
        }
//        console.log(targetModel + " " + animateName);
        $(targetModel).modal({
            remote:href
        }).animateCss(animateName);
        //callback.apply(this);
    }
    /**
     * 隐藏模态框方法
     * @param targetModel 模态框选择器，jquery选择器
     * @param animateName 隐藏动作
     * @ callback 回调方法
     */
    var modalHide = function(flag,animateName, callback){

        var targetModel = "#modal-main";
        if(flag) {
            $(targetModel).modal('hide');
        }else {
            var animationOut = [
                "bounceOut","bounceOutDown","bounceOutLeft","bounceOutRight","bounceOutUp",
                "fadeOut", "fadeOutDown", "fadeOutLeft", "fadeOutRight", "fadeOutUp",
                "fadeOutDownBig", "fadeOutLeftBig", "fadeOutRightBig", "fadeOutUpBig",
                "flipOutX","flipOutY", "lightSpeedOut","rotateOut","rotateOutDownLeft",
                "rotateOutDownRight","rotateOutUpLeft","rotateOutUpRight",
                "slideOutDown","slideOutLeft", "slideOutRight", "slideOutUp",
                "rollOut","hinge"];
            if(!animateName || animationOut.indexOf(animateName)==-1){
                console.log(animationOut.length);
                var intRandom =  Math.floor(Math.random()*animationOut.length);
                animateName = animationOut[intRandom];
            }

            $(targetModel).children().click(function(e){e.stopPropagation()});
            $(targetModel).animateCss(animateName);
            $(targetModel).delay(900).hide(1,function(){
                $(this).removeClass('animated ' + animateName);
                $(targetModel).modal("toggle");
            });
            callback.apply(this);
        }
    }

    /**
     * 获取项目根路径
     */
    function getRootPath() {
        var strFullPath = window.document.location.href;
        var strPath = document.location.pathname;
        if(strPath == null || strPath =='/') {
            return strFullPath;
        }else {
            var pos = strFullPath.indexOf(strPath);
            var prePath = strFullPath.substring(0,pos);
            // var postPath = strPath.substring(0,strPath.substring(1).indexOf("/")+1);
            return prePath;
        }
    }
    function getHostIP() {
        var hrefs = getRootPath();
        var temp = hrefs.substring(6);
        return hrefs.substring(0,temp.indexOf(":")+6);
    }
    var modalDataInit = function(info){
        //alert(info);
        //填充数据，对弹出模态框数据样式初始化或修改
    }
    /*]]>*/
</script>
</body>
</html>
